<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>{{article.title}}</title>
<meta name="keywords" content="" />
<meta name="description" content="{{article.title}}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/public/static/css/base.css" rel="stylesheet">
<link href="/public/static/css/index.css" rel="stylesheet">
<link href="/public/static/css/info.css" rel="stylesheet">
<link href="/public/static/css/m.css" rel="stylesheet">
<link rel="stylesheet" href="/public/js/plugins/editor/css/editormd.preview.css"></link>
<script src="/public/static/js/jquery.min.js" ></script>
<script src="/public/static/js/jquery.easyfader.min.js"></script>
<script src="/public/static/js/hc-sticky.js"></script>
<script src="/public/static/js/comm.js"></script>
<script src="/public/static/js/scrollreveal.js"></script>
<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<!--[if lt IE 9]>
<script src="/public/static/js/modernizr.js"></script>
<![endif]-->
<script type="text/javascript" src="/public/static/js/ajax.js"></script>
<style>
 #md_content ul>li{list-style: decimal}
 #md_content ul>li>ul>li{list-style: disc}
 #md_content ul>li>ul>li>ul>li{list-style: circle}
</style>
</head>
<body>
    {{include './header.html'}}
<article>
  <main>
  <div class="infosbox">
    <div class="newsview">
      <h3 class="news_title">{{article.title}}</h3>
      <div class="bloginfo">
        <ul>
          <li class="author">作者：{{article.authorId.name}} </li>
          <li class="lmname">
            
          </li>
          <li class="timer">{{article.updateAt | timestamp}}</li>
          <li class="view">{{article.countInfo.visitCount}}人已阅读</li>
        </ul>
      </div>
      <div class="tags"></div>
      <!-- <div class="news_about"><strong>简介</strong>自从入了这行，很多人跟我说可以做网络教程，我也有考虑，但最终没有实现，因为我觉得在这个教程泛滥的时代，直接做一套免费的原创个人博客模板更为实在。每当看到自己喜欢的配色图片或者布局，惊艳的js或者css3效果的时候，就有了做模板的冲动。</div> -->
      
        <div class="news_con" id="md_content">

            <textarea id="md_textarea">{{article.content}}</textarea>
        </div>
    </div>
    <div class="share">
<p class="diggit"><a href="JavaScript:ding('{{article._id}}');"> 很赞哦！ </a>(<b id="diggnum"> </b>)</p>

</div>
    <!-- <div class="nextinfo">
      <p>上一篇：<a href='/life/11.html'>我是怎么评价自己的？</a></p>
      <p>下一篇：<a href='/life/13.html'>个人博客，属于我的小世界！</a></p>
    </div> -->
    <style>
        .container{
          width: 100%;
        }
        .commentbox{
          width: 96%;
          margin: 20px auto;
        }
        .mytextarea {
            width: 100%;
            overflow: auto;
            word-break: break-all;
            height: 100px;
            color: #000;
            font-size: 1em;
            resize: none;
            border:1px solid black !important;
            border-radius: 4px;
            box-sizing: border-box;padding: 5px;
        }
        .comment-list{
          width: 96%;
          margin: 20px auto;
          clear: both;
          padding-top: 20px;
        }
        .comment-list .comment-info{
          position: relative;
          margin-bottom: 20px;
          margin-bottom: 20px;
          border-bottom: 1px solid #ccc;
        }
        .comment-list .comment-info header{
          width: 10%;
          position: absolute;
        }
        .comment-list .comment-info header img{
          width: 100%;
          border-radius: 50%;
          padding: 5px;
        }
        .comment-list .comment-info .comment-right{
          padding:5px 0px 5px 11%; 
        }
        .comment-list .comment-info .comment-right h3{
          margin: 5px 0px;
        }
        .comment-list .comment-info .comment-right .comment-content-header{
          height: 25px;
        }
        .comment-list .comment-info .comment-right .comment-content-header span,.comment-list .comment-info .comment-right .comment-content-footer span{
          padding-right: 2em;
          color: #aaa;
        }
        .comment-list .comment-info .comment-right .comment-content-header span,.comment-list .comment-info .comment-right .comment-content-footer span.reply-btn,.send,.reply-list-btn{
          cursor: pointer;
        }
        .comment-list .comment-info .comment-right .reply-list {
          border-left: 3px solid #ccc;
          padding-left: 7px;
        }
        .comment-list .comment-info .comment-right .reply-list .reply{
          border-bottom: 1px dashed #ccc;
        }
        .comment-list .comment-info .comment-right .reply-list .reply div span{
          padding-left: 10px;
        }
        .comment-list .comment-info .comment-right .reply-list .reply p span{
          padding-right: 2em;
          color: #aaa;
        }
        #comment{
          display: block;
          background: #040404;
          color: #fff;
          border: 0;
          line-height: 30px;
          padding: 0 20px;
          border-radius: 5px;
        }
      </style>
    <script src="/public/static/js/jquery.comment.js"></script>
    <div class="news_pl">
      <h2>文章评论</h2>
    <div class="gbko">
        <div class="container">
            <div class="commentbox">
            <textarea cols="80" rows="50" placeholder="来说几句吧......" class="mytextarea" id="content1"></textarea>
            <div class="btn btn-info pull-right" id="comment">评论</div>
            </div>
            <div class="comment-list">
            
            </div>
       
    </div>
  </div>
  </main>
  <aside id="stickMe">
    <div class="r_box" >     
      <div class="tuijian">
        <h2 id="tab"><a href="#"class="current">点击排行</a><a href="#">站长推荐</a></h2>       
     <div id="content">
        <ul style="display:block;">
          {{each clickRank}}
          <li><a href="/category{{$value.categoryId.cateid}}/{{$value._id}}" target="_blank">{{$value.title}} </a></li>
          {{/each}}
        </ul>             
        <ul>
          {{each topRank}}
          <li><a href="/category{{$value.categoryId.cateid}}/{{$value._id}}" target="_blank">{{$value.title}} </a></li>
          {{/each}}
        </ul>
       </div>
      </div>
 <div class="wdxc">
        <h2>图文精选</h2>
        <ul>
        {{each piclist}}
          <li><a href="/category{{$value.categoryId.cateid}}/{{$value._id}}" title="【{{$value.title}}】" target="_blank"><img src="{{$value.thumbnail[0]}}"></a></li>
       {{/each}}
        </ul>
      </div>
<div class="cloud">
      <h2>标签云</h2>
      <ul>
        {{each tagAll}}
          <a href="/taglist{{$value._id}}" target="_blank">{{$value.tagName}}</a> 
        {{/each}}      
    </ul>
    </div>
      <div class="guanzhu">
        <h2>关注我 Add friends</h2>
        <ul>
          <img src="/public/static/picture/wx.jpg">
        </ul>
      </div>
    </div>
  </aside>
</article>
{{include './footer.html'}}


<script src="/public/js/plugins/editor/lib/marked.min.js"></script>
<script src="/public/js/plugins/editor/lib/prettify.min.js"></script>
<script src="/public/js/plugins/editor/lib/raphael.min.js"></script>
<script src="/public/js/plugins/editor/lib/underscore.min.js"></script>
<script src="/public/js/plugins/editor/lib/sequence-diagram.min.js"></script>
<script src="/public/js/plugins/editor/lib/flowchart.min.js"></script>
<script src="/public/js/plugins/editor/lib/jquery.flowchart.min.js"></script>
<script src="/public/js/plugins/editor/editormd.min.js"></script>
<script>
editormd.emoji = {path : "https://www.liqunonline.cn/zb_users/plugin/Editormd/images/github-emojis/",ext  : ".png"};

//点赞
function ding(id){
    if($.cookie(id)){
      alert('你已经点过赞了')
    }else{
      $.cookie(id,1)
    $.ajax({
      url:'/digg'+id,
      type:'POST',
      success:function(res){
        if(res.code==1){
          $('#diggnum').text(res.num)
        }
      }
    })
    }
  }

$(function(){
  
  //markdown
    var EditormdView;
    EditormdView = editormd.markdownToHTML("md_content", {
        emoji           : true,
        toc             : true,
        tocm            : true,
        taskList        : true,
        tex             : false,
        flowChart       : true,
        sequenceDiagram : false,
        htmlDecode: true
    });

 


    $.ajax({
          url:'/digg{{article._id}}',
          type:'GET',
          success:function(res){
            if(res.code==1){
              $('#diggnum').text(res.num)
            }else{
              $('#diggnum').text(0)
            }
          }
        })

    //评论列表
    $.ajax({
      url:"/comments{{article._id}}",
      type:"GET",
      success:function(res){
        $(".comment-list").addCommentList({data:res,add:""});
      }
    })
  
    //评论功能
		$("#comment").click(function(){
			var obj = new Object();
			obj.img="/public/static/images/tx1.jpg";
			obj.replyName="游客";
			obj.content=$("#content1").val();
			obj.browse="深圳";
			obj.osname="win8"; 
      obj.artid = "{{article._id}}";
      obj.cateid =  "{{Cateid}}"   
      $.ajax({
        url:'/comments',
        data:obj,
        type:'POST',
        success:function(res){
           var comment = JSON.parse(JSON.stringify(res))
           $(".comment-list").addCommentList({data:[],add:comment.msg});
        }
      })
			
		});
	})
</script>

</html>
